<template>
    <div>
        <h2>使用Hooks 将数据与方法等进行封装</h2>
        <span>加{{ val }}，加倍{{ val*10 }}</span> <br/>
        <button @click="changeVal">增加值</button> <br/>
        <hr/>
        <img v-for="(d,index) in dogList" :key="index" :src="(d as string)"/><br/>
        <button @click="getDog">再来一只</button>
    </div>
</template>
<script lang="ts" setup name="useHooks">
 import useSum from '@/types/useSum'  //导入定义的ts
 import useDog from '@/types/useDog'
    let {val,changeVal}=useSum();  //加载ts中的方法
    let {dogList,getDog}=useDog();
</script>

<style scoped>
  img {
    height: 100px;
    margin-left: 10px;
  }
</style>